﻿@{
    Layout = null;
    ViewData["Title"] = "Index";
}
<script src="~/js/vue.js"></script>
<script src="~/js/axios.js"></script>
<script src="~/element-ui/lib/index.js"></script>
<link rel="stylesheet" href="~/element-ui/lib/theme-chalk/index.css" />

<div id="add">
    <el-form label-width="80px" v-if="item1">
        <div id="headDiv">
            <el-button type="primary" round=round size="mini" v-on:click="fenyeselect()">查询</el-button>
        </div>
        <span class="demonstration">请选择员工所在I/II/III级机构</span>
        <el-cascader expand-trigger="hover"
                     :options="parentCateList"
                     :props="cascaderProps"
                     v-model="selectedKeys"
                     v-on:change="parentCateChanged"
                     clearable
                     change-on-select
                     ref="casc"
                     size="mini">
            @*el-cascader使用clearable，完全清空，删除旧项*@
            @*change-on-select下拉菜单选择*@
        </el-cascader>
        <div class="block">
            <span class="demonstration">请输入建档时间</span>
            <el-date-picker v-model="value2"
                            type="daterange"
                            align="right"
                            unlink-panels
                            clearable
                            v-on:change="lll"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            :picker-options="pickerOptions">
            </el-date-picker>
        </div>
    </el-form>
    <el-form v-if="item2">
        <el-button type="primary" round=round size="mini" v-on:click="fanhu1()">返回</el-button>
        <el-table :data="tableData"
                  :border="true" style="width: 100%">
            <el-table-column prop="first_kind_name"
                             label="I级机构"
                             width="180">
            </el-table-column>
            <el-table-column prop="second_kind_name"
                             label="II级机构"
                             width="180">
            </el-table-column>
            <el-table-column prop="third_kind_name"
                             label="III机构"
                             width="180">
            </el-table-column>
            <el-table-column prop="salary_standard_name"
                             label="薪酬标准"
                             width="180">
            </el-table-column>
            <el-table-column prop="human_name"
                             label="名字"
                             width="180">
            </el-table-column>
            <el-table-column label="调动">
                <template slot-scope="scope">
                    <el-button size="mini"
                               v-on:click="handleEdit(scope.row)">调动</el-button>
                </template>
            </el-table-column>
        </el-table>

        @*    分页组件*@
        <el-pagination v-on:size-change="handleSizeChange"
                       v-on:current-change="handleCurrentChange"
                       :current-page="currentPage"
                       :page-sizes="[3, 6, 9, 12]"
                       :page-size="pageSize"
                       layout="total, sizes, prev, pager, next, jumper"
                       :total="rows">
        </el-pagination>

    </el-form>
    <el-form ref="form" :model="form" :rules="rules" label-width="150px" v-if="item3">
        <div id="headDiv">
            <el-button type="primary" round=round size="mini" v-on:click="tijiao()">提交</el-button>
            <el-button type="primary" round=round size="mini" v-on:click="fanhu2()">返回</el-button>
        </div>
        <el-input v-model="form.huf_id" :disabled="true" v-if="false"></el-input>
        @*第一行*@
        <el-row>
            <el-col :span="5">
                <el-form-item label="档案编号" size="mini">
                    <el-input v-model="form.human_id" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="姓名" size="mini">
                    <el-input v-model="form.human_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        @*第二行*@
        <el-row>
            <el-col :span="5">
                <el-form-item label="原一级机构" size="mini">
                    <el-input v-model="form.first_kind_id" :disabled="true" v-if="false"></el-input>
                    <el-input v-model="form.first_kind_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="原二级机构" size="mini">
                    <el-input v-model="form.second_kind_id" :disabled="true" v-if="false"></el-input>
                    <el-input v-model="form.second_kind_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="原三级机构" size="mini">
                    <el-input v-model="form.third_kind_id" :disabled="true" v-if="false"></el-input>
                    <el-input v-model="form.third_kind_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        @*第三行*@
        <el-row>
            <el-col :span="5">
                <el-form-item label=" 原职位分类 " size="mini">
                    <el-input v-model="form.major_kind_id" :disabled="true" v-if="false"></el-input>
                    <el-input v-model="form.major_kind_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="原职位名称" size="mini">
                    <el-input v-model="form.major_id" :disabled="true" v-if="false"></el-input>
                    <el-input v-model="form.major_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="原薪酬标准" size="mini">
                    <el-input v-model="form.salary_standard_id" :disabled="true" v-if="false"></el-input>
                    <el-input v-model="form.salary_standard_name" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="原薪酬总额" size="mini">
                    <el-input v-model="form.salary_sum" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        @*第四行*@
        <el-row>
            <el-col :span="5">
                <el-form-item label="新一二三级机构" size="mini" prop="selectedKeys">
                    <el-cascader expand-trigger="hover"
                                 :options="parentCateList"
                                 :props="cascaderProps"
                                 v-model="selectedKeys"
                                 v-on:change="parentCateChanged"
                                 clearable
                                 change-on-select
                                 ref="casc"
                                 size="mini">
                        @*el-cascader使用clearable，完全清空，删除旧项*@
                        @*change-on-select下拉菜单选择*@
                    </el-cascader>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="新职分类名称" size="mini" prop="selectedKeys1">
                    <el-cascader expand-trigger="hover"
                                 :options="parentCateList1"
                                 :props="cascaderProps1"
                                 v-model="selectedKeys1"
                                 v-on:change="parentCateChanged1"
                                 clearable
                                 change-on-select
                                 ref="casc1"
                                 size="mini">
                        @*el-cascader使用clearable，完全清空，删除旧项*@
                        @*change-on-select下拉菜单选择*@
                    </el-cascader>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="新薪酬标准" size="mini" prop="new_salary_standard_name">
                    <el-select v-model="new_salary_standard_name" placeholder="请选择" size="mini" v-on:change="hh6">
                        <el-option v-for="item5 in options5"
                                   :key="item5.standard_id"
                                   :label="item5.standard_name"
                                   :value="item5.standard_name">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="新薪酬总额" size="mini">
                    <el-input v-model="form.new_salary_sum" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        @*第五行*@
        <el-row>
            <el-col :span="5">
                <el-form-item label="登记人" size="mini">
                    <el-input v-model="form.register" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="5">
                <el-form-item label="登记时间" size="mini">
                    <el-input v-model="form.regist_time" :disabled="true"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
        @*第六行*@
        <el-row>
            <el-col :span="20">
                <el-form-item label="调动原因" size="mini" prop="change_reason">
                    <el-input type="textarea" :rows="5" v-model="form.change_reason"></el-input>
                </el-form-item>
            </el-col>
        </el-row>
    </el-form>
</div>

<script type="text/javascript">
    new Vue({
        el: "#add",
        data: {
            tableData: [],
            form: {
                mch_id: "",
                //档案编号
                human_id: "",
                //姓名
                human_name: "",
                //原一/二/三级机构id
                first_kind_id: "",
                second_kind_id: "",
                third_kind_id: "",
                //原一/二/三级机构名称
                first_kind_name: "",
                second_kind_name: "",
                third_kind_name: "",
                //原职位分类/职位名称/薪酬标准id
                major_kind_id: "",
                major_id: "",
                salary_standard_id: "",
                //原职位分类/职位名称/薪酬标准名称
                major_kind_name: "",
                major_name: "",
                salary_standard_name: "",
                //原薪酬总额
                salary_sum: "",
                //新薪酬总额
                new_salary_sum: "",
                //登记人
                register: sessionStorage.getItem('userName'),
                //登记时间
                regist_time: "",
                //调动原因
                change_reason: "",
            },
            rules: {

            },
            //新薪酬标准
            new_salary_standard_name: "",
            item1: true,
            item2: false,
            item3: false,
            options5: [],
            pageSize: 3,
            currentPage: 1,
            rows: 1,
            //新一/二/三级机构
            cascaderProps: {
                value: "id",
                label: "name",
                children: "children",
            },
            //新职位分类/名称
            cascaderProps1: {
                value: "id",
                label: "name",
                children: "children",
            },
            selectedKeys: [],
            selectedKeys1: [],
            parentCateList: [],
            parentCateList1: [],
            //日期
            pickerOptions: {
                shortcuts: [{
                    text: '最近一周',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近一个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                        picker.$emit('pick', [start, end]);
                    }
                }, {
                    text: '最近三个月',
                    onClick(picker) {
                        const end = new Date();
                        const start = new Date();
                        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                        picker.$emit('pick', [start, end]);
                    }
                }]
            },
            value2: []
        },
        methods: {
            lll(val) {
                if (val == null) {
                    this.value2 = [];
                }
                console.info("值改变事件：", val);
            },
            //条件分页查询
            fenyeselect() {
                if (this.selectedKeys == '') {
                    axios.get('/Major_change/FenYeSelect', {
                        params: {
                            pageSize: this.pageSize,
                            currentPage: this.currentPage,
                        }
                    }).then(res => {
                        this.tableData = res.data.dt;
                        this.rows = res.data.rows;
                        this.item1 = false;
                        this.item2 = true;

                    })
                } else {
                    console.info("this.value2[0]:", this.value2[0] + "this.value2[1]:", this.value2[1]);
                    axios.post('/Major_change/FenYeSelect_dji', {
                        pageSize: this.pageSize,
                        currentPage: this.currentPage,
                        yiji: this.zhi[0],
                        erji: this.zhi[1],
                        sanji: this.zhi[2],
                        shijianKS: this.value2[0],
                        shijianJS: this.value2[1],
                    }).then(res => {
                        this.tableData = res.data.dt;
                        this.rows = res.data.rows;
                        this.item1 = false;
                        this.item2 = true;

                    })
                }
            },
            //每页显示数改变事件
            handleSizeChange: function(val) {
                this.pageSize = val;
                this.fenyeselect();
            },
            //页码改变事件
            handleCurrentChange: function(val) {
                this.currentPage = val;
                this.fenyeselect();
            },
            //级联选择查询
            select() {
                axios.get('/Major_change/Third1')
                    .then(res => {
                        console.info(res.data);
                        this.parentCateList = res.data;
                    });
                axios.get('/Major_change/Third2')
                    .then(res => {
                        console.info(res.data);
                        this.parentCateList1 = res.data;
                    });
                //新薪酬标准
                axios.get('/Major_change/Select').then(res => {
                    console.info("res:", res);
                    this.options5 = res.data;
                });
            },
            parentCateChanged: function(val) {
                if (this.selectedKeys.length > 0) {
                    this.key = this.selectedKeys;
                    this.zhi = this.$refs["casc"].getCheckedNodes()[0].pathLabels;
                }
            },
            parentCateChanged1: function(val) {
                if (this.selectedKeys1.length > 0) {
                    this.key1 = this.selectedKeys1;
                    this.zhi1 = this.$refs["casc1"].getCheckedNodes()[0].pathLabels;
                }
            },
            hh6(val) {
                let obj = {};
                obj = this.options5.find(item => {
                    return item.standard_name === val
                })
                console.info("obj", obj);
                this.standard_id = obj.standard_id;
                this.form.new_salary_sum = obj.salary_sum;
            },
            //调动
            handleEdit(row) {
                console.info("row:",row)
                //关闭查询
                this.item2 = false;
                //打开调动
                this.item3 = true;
                //档案编号
                this.form.human_id = row.human_id;
                //姓名
                this.form.human_name = row.human_name;
                //一/二/三机构ID
                this.form.first_kind_id = row.first_kind_id;
                this.form.second_kind_id = row.second_kind_id;
                this.form.third_kind_id = row.third_kind_id;
                //一/二/三机构名称
                this.form.first_kind_name = row.first_kind_name;
                this.form.second_kind_name = row.second_kind_name;
                this.form.third_kind_name = row.third_kind_name;
                //职位分类/职位名称/薪酬标准ID
                this.form.major_kind_id = row.human_major_kind_id;
                this.form.major_id = row.human_major_id;
                this.form.salary_standard_id = row.salary_standard_id;
                //职位分类/职位名称/薪酬标准名称
                this.form.major_kind_name = row.human_major_kind_name;
                this.form.major_name = row.hunma_major_name;
                this.form.salary_standard_name = row.salary_standard_name;
                //薪酬总额
                this.form.salary_sum = row.salary_sum;
            },
            //返回
            fanhu1() {
                //打开输入条件
                this.item1 = true;
                //关闭查询
                this.item2 = false;
            },
            fanhu2() {
                //关闭查询
                this.item2 = true;
                //关闭调动
                this.item3 = false;
            },
            //时间
            tick() {
                var d = new Date();
                var y = d.getFullYear();
                var moth = d.getMonth() + 1;
                var date = d.getDate();
                var h = d.getHours();
                var m = d.getMinutes();
                var s = d.getSeconds();
                var hh = 20 - 1 - h;
                var mm = 60 - 1 - m;
                var ss = 60 - s;
                if (hh > 0) {
                    mm = mm + 60 * hh;
                }
                if (moth < 10) {
                    moth = "0" + moth;
                }
                if (date < 10) {
                    date = "0" + date;
                }
                if (h < 10) {
                    h = "0" + h;
                }
                if (m < 10) {
                    m = "0" + m;
                }
                if (s < 10) {
                    s = "0" + s;
                }
                if (mm < 10) {
                    mm = "0" + mm;
                }
                if (ss < 10) {
                    ss = "0" + ss;
                }
                this.form.regist_time = y + " - " + moth + " - " + date + " " + h + ": " + m + ": " + s;
            },
            //调动保存
            tijiao() {
                if (this.selectedKeys == "" || this.selectedKeys1 == "" || this.new_salary_standard_name == "" || this.form.change_reason == "") {

                    alert("请输入‘机构’，‘职位’，‘薪酬’和‘调动原因’");
                } else {
                    axios.post('/Major_change/Add', {
                        //档案编号
                        human_id: this.form.human_id,
                        //姓名
                        human_name: this.form.human_name,
                        //原一/二/三级机构编号
                        first_kind_id: this.form.first_kind_id,
                        second_kind_id: this.form.second_kind_id,
                        third_kind_id: this.form.third_kind_id,
                        //原一/二/三级机构名称
                        first_kind_name: this.form.first_kind_name,
                        second_kind_name: this.form.second_kind_name,
                        third_kind_name: this.form.third_kind_name,
                        //原职位分类/职位编号/薪酬标准ID
                        major_kind_id: this.form.major_kind_id,
                        major_id: this.form.major_id,
                        salary_standard_id: this.form.salary_standard_id,
                        //原职位分类/职位名称/薪酬标准名称
                        major_kind_name: this.form.major_kind_name,
                        major_name: this.form.major_name,
                        salary_standard_name: this.form.salary_standard_name,
                        ////原薪酬总额。
                        salary_sum: this.form.salary_sum,
                        //新一/二/三级机构编号
                        new_first_kind_id: this.key[0],
                        new_second_kind_id: this.key[1],
                        new_third_kind_id: this.key[2],
                        //新一/二/三级机构名称
                        new_first_kind_name: this.zhi[0],
                        new_second_kind_name: this.zhi[1],
                        new_third_kind_name: this.zhi[2],
                        //新职位分类/职位编号/薪酬标准ID
                        new_major_kind_id: this.key1[0],
                        new_major_id: this.key1[1],
                        new_salary_standard_id: this.standard_id,
                        //新职位分类/职位名称/薪酬标准名称
                        new_major_kind_name: this.zhi1[0],
                        new_major_name: this.zhi1[1],
                        new_salary_standard_name: this.new_salary_standard_name,
                        ////新薪酬总额
                        new_salary_sum: this.form.new_salary_sum,
                        ////登记人
                        register: this.form.register,
                        ////登记时间
                        regist_time: new Date(),
                        //调动原因
                        change_reason: this.form.change_reason,
                        //
                        check_status: 0,
                    }).then(res => {
                        if (res.data > 0) {
                            alert(" 调动成功");
                            this.item1 = true;
                            this.item3 = false;
                            this.qikong();
                        }
                    });
                }
            },
            qikong() {
                this.selectedKeys = "";
                this.selectedKeys1 = "";
                this.new_salary_standard_name = "";
                this.form.new_salary_sum = "";
                this.form.change_reason = "";
            },


        },
        mounted() {
            this.select();
            window.onload = this.tick;
            var out = window.setInterval(this.tick, 1000);
        }
    })
</script>
